﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>更多模块</title>
    <style>
    body{overflow:scroll; background-color: rgba(220, 220, 220,0.5);}
    div{background-color: rgba(190, 140, 90,0.4);width:1400px;height:62px;}
li{list-style: none;}
    a{font-size:140%;float:right;}
    a:link{color: #111111;text-decoration:none;}	/* 未访问的链接 */
    a:visited {color: #eeeeee;text-decoration:none;}
    a:hover {color: rgba(200 ,76 ,108,0.4);text-decoration:none;}	/* 鼠标移动到链接上 */
    a:active {color:rgb(160,130,120);text-decoration:none;}	/* 选定的链接 */

    span{float:right;}
    .mk{
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    width:200px;height:300px;}
    </style>
</head>
<body>
<div><h1 style="position:relative;top:10px;left:15px;">学习任务智能规划系统</h1>
    <div class="c"><b><a href="/更多模块.html">更多模块&nbsp;</a>
        <a href="/错题集.html">错题集&nbsp;</a>
        <a href="/首页1.html">首页&nbsp;</a>
    </b></div>
</div>


    <div class="mk" style="border:solid rgba(220, 220, 220,0.3);position:absolute;top:200px;left:135px;box-shadow:2px 2px 3px 3px rgba(20,50,60,0.9);"><h2>计算机类</h2>
        <h4> <li>Java<span>添加</span></li>
        <li>C/C++<span>添加</span></li>
        <li>SQL<span>添加</span></li>
        <li>C#<span>添加</span></li>
        <li>PHP<span>添加</span></li>
        <li>Python<span>添加</span></li>
        <li>Basic<span>添加</span></li>
        <li>数据结构<span>添加</span></li>
        <li>Javascript<span>添加</span></li>
        </h4></div>


    <div class="mk" style="border:solid rgba(220, 220, 220,0.5);position:absolute;top:200px;left:570px;box-shadow:2px 2px 3px 3px rgba(20,50,60,0.9);"><h2>英语类</h2>
        <h4><li>CET-4<span>添加</span></li>
        <li>CET-6<span>添加</span></li>
        <li>专业四级<span>添加</span></li>
        <li>专业八级<span>添加</span></li>
        <li>托福<span>添加</span></li>
        <li>雅思<span>添加</span></li> </h4></div>


    <div class="mk" style="border:solid rgba(220, 220, 220,0.5);position:absolute;top:200px;left:1015px;box-shadow:2px 2px 3px 3px rgba(20,50,60,0.9);"><h2>必修课类</h2>
        <h4><li>大学语文<span>添加</span></li>
        <li>大学物理<span>添加</span></li>
        <li>高等数学<span>添加</span></li>
        <li>离散数学<span>添加</span></li>
        <li>线性代数<span>添加</span></li>
        <li>概率论<span>添加</span></li>
        <li>数字逻辑<span>添加</span></li>
        <li>模拟电路<span>添加</span></li> </h4></div>


    <div class="mk" style="border:solid rgba(220, 220, 220,0.6);position:absolute;top:630px;left:135px;box-shadow:2px 2px 3px 3px rgba(20,50,60,0.9);"><h2>小语种类</h2>
        <h4><li>俄语<span>添加</span></li>
        <li>日语<span>添加</span></li>
        <li>意大利语<span>添加</span></li>
        <li>法语<span>添加</span></li>
        <li>德语<span>添加</span></li>
        <li>西班牙语<span>添加</span></li>
        <li>韩语<span>添加</span></li>
        <li>泰语<span>添加</span></li> </h4></div>


    <div class="mk" style="border:solid rgba(220, 220, 220,0.5);position:absolute;top:630px;left:570px;box-shadow:2px 2px 3px 3px rgba(20,50,60,0.9);"><h2>其他类</h2>
        <h4><li>公务员<span id="4">添加</span></li>
        <li>会计师<span>添加</span></li>
        <li>律师<span>添加</span></li>
        <li>教师资格证<span>添加</span></li>
        <li>一级建造师<span>添加</span></li>
        <li>驾驶证<span>添加</span></li>
            </h4></div>


    <div class="mk" style="border:solid rgba(220, 220, 220,0.5);position:absolute;top:630px;left:1015px;box-shadow:2px 2px 3px 3px rgba(20,50,60,0.9);"><h2>生活百科类</h2>
        <h4><li>医疗健身<span>添加</span></li>
        <li>人文地理<span>添加</span></li>
        <li>历史古迹<span>添加</span></li>
        <li>文化遗产<span>添加</span></li>
        <li>动物世界<span>添加</span></li> </h4></div>


<script type="text/javascript" src="https://www.3cp.cn/js/common/jquery-1.12.0-min.js"></script>

<script>
$('span').click(function(){
openDataBase(){
              db.openDatabase("sjk",1,"t_kecheng").then(res=>{

              db.insert("t_kecheng",{id:"4",name:"公务员考试"})

                                                             })
}



    });
    $(document).ready(function(){
    
    

        $.ajax({

            //请求方式

            type:"GET",

            //文件位置

            url:"/api?fid=jindu",

            //返回数据格式为json,也可以是其他格式如

            dataType: "json",

            //请求成功后要执行的函数，拼接html

            success:function(data){


                var str="";

                $.each(data.data,function(i,n){

                    str+="<div class=\"comm-list-item\"><img src=\"2345jt20190121000944.png\"><span class=\"kc\"><strong>"+n.name+"</strong></span>"+"<span class=\"lv\"><b>"+"Lv."+(n.count/2)+"</b></span>"+"<span class=\"sm\"><b>"+(n.bingo+n.error)+"/"+n.count+"</b></span><div class=\"jdt\"><div class=\"jd\" id=\"text\" style=\"width:100px;\"></div></div><div class=\"rw\"><ul><li><a href=\"http://localhost/%E7%AD%94%E9%A2%98%E7%95%8C%E9%9D%A2.html\" target=\"答题\">每日一练环节</a></li><li><a href=\"#\">小试身手环节</a></li><li><a href=\"#\">真题演练环节</a></li></ul></div><div class=\"comm-list-cont\"><a href=\"#\"></a><div class=\"\"><p></p><div><button id=\"remove\" style=\"float:right;\">删除Div</button></div></div></div></div>";

                 
                    
                    
                });

                   
 
                $(".mk").after(str);    
                
               $.each(data.data,function(i,n){

                    
                    alert($(".jd").css("width"));
                
                    $(".jd:eq("+i+")").width((n.bingo+n.error)/n.count*190);
                   
                    
                });
               
            }

        });
        


})

</script>
</body>
</html>